<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>sql2struct</title>
    <link rel="stylesheet" href="/static/css/element-ui.css">
    <link rel="stylesheet" href="/static/css/sql2struct.css">
    <link rel="shortcut icon" href="/favicon.ico">
    <link href="https://cdn.bootcss.com/font-awesome/5.10.0-11/css/all.min.css" rel="stylesheet">
    <link rel="stylesheet" href="/static/css/style.css" type="text/css">
</head>
<body>
{{template "aside"}}
<main>
    <div class="container">
        <div id="app">
            <el-container>
                <el-header>
                    <el-menu
                            :default-active="activeIndex"
                            class="el-menu-demo"
                            mode="horizontal"
                            @select="handleSelect"
                            background-color="#545c64"
                            text-color="#fff"
                            active-text-color="#ffd04b">
                        <el-menu-item index="1">SQL2Struct</el-menu-item>
                        <el-menu-item index="2" @click="dialogFormVisible = true">options</el-menu-item>
                        <el-menu-item index="3"><a href="https://github.com/mikemintang/sql2struct.git" target="_blank">Github</a>
                        </el-menu-item>
                    </el-menu>
                </el-header>
                <el-main>
                    <el-row :gutter="60">
                        <el-col :span="12">
                            <div class="grid-content bg-purple">
                                <el-form ref="form" label-position="top" label-width="80px">
                                    <el-form-item label="SQL">
                                        <el-input type="textarea" placeholder="input sql for creating table in mysql"
                                                  :rows="30" v-model="sqlContent"></el-input>
                                    </el-form-item>
                                </el-form>
                            </div>
                        </el-col>
                        <el-col :span="12">
                            <div class="grid-content bg-purple-light">
                                <el-form ref="form" label-position="top" label-width="80px">
                                    <el-form-item label="Struct">
                                        <el-input type="textarea" placeholder="data struct used in golang" :rows="30"
                                                  v-model="structContent"></el-input>
                                    </el-form-item>
                                </el-form>
                            </div>
                        </el-col>
                    </el-row>
                </el-main>
                <el-footer>

                </el-footer>
            </el-container>

            <el-dialog title="options" :visible.sync="dialogFormVisible">
                <el-form>
                    <el-form-item label="gorm">
                        <el-switch
                                v-model="useGorm"
                                active-color="#13ce66"
                                inactive-color="#ff4949">
                        </el-switch>
                    </el-form-item>
                    <el-form-item label="sqlx">
                        <el-switch
                                v-model="useSqlx"
                                active-color="#13ce66"
                                inactive-color="#ff4949">
                        </el-switch>
                    </el-form-item>
                    <el-form-item label="json">
                        <el-switch
                                v-model="useJson"
                                active-color="#13ce66"
                                inactive-color="#ff4949">
                        </el-switch>
                    </el-form-item>
                    <el-form-item label="form">
                        <el-switch
                                v-model="useForm"
                                active-color="#13ce66"
                                inactive-color="#ff4949">
                        </el-switch>
                    </el-form-item>
                    <el-form-item label="typeMap">
                        <el-input type="textarea" placeholder="" :rows="14" v-model="typeMapStr"></el-input>
                    </el-form-item>
                </el-form>
            </el-dialog>
        </div>
    </div>
</main>
<script src="../static/js/qrcode.min.js"></script>
<script src="/static/js/vue@2.5.2.js"></script>
<script src="/static/js/element-ui@2.0.1.js"></script>
<script src="/static/js/sql2struct.js"></script>
</body>
</html>